function ProductNav() {
    // 获取导航栏中的 a 标签
    let nav_a = document.getElementsByClassName("Navigation_nav_a");
    // 获取到要显示的 div
    let productdetail = document.getElementById("NavigationProduct");

    // 遍历 nav_a 集合中的元素并添加鼠标悬停事件监听
    for (let i = 0; i < nav_a.length; i++) {
        nav_a[i].addEventListener('mouseover', function () {
            // 显示 NavigationProduct
            productdetail.style.height = '230px';
        });

        // 添加鼠标移出事件监听
        nav_a[i].addEventListener('mouseout', function () {
            // 隐藏 NavigationProduct
            productdetail.style.height = '0';
        });
    }
} function ce() {
    // 获取元素及其对应的图片元素
    let iphone = document.getElementById('iphone');
    let grzx = document.getElementById('grzx');
    let shfw = document.getElementById('shfw');
    let rgkf = document.getElementById('rgkf');
    let gwc = document.getElementById('gwc');
    let topElem = document.getElementById('top');

    let iphone_img = document.getElementById('iphone_img');
    let grzx_img = document.getElementById('grzx_img');
    let shfw_img = document.getElementById('shfw_img');
    let rgkf_img = document.getElementById('rgkf_img');
    let gwc_img = document.getElementById('gwc_img');
    let top_img = document.getElementById('top_img');

    // 为 iphone 元素添加事件监听
    iphone.addEventListener('mousemove', function () {
        iphone_img.innerHTML = '<img src="images/10007.png" alt="">';
    });
    iphone.addEventListener('mouseout', function () {
        iphone_img.innerHTML = '<img src="images/iphone.png" alt="">';
    });

    // 为 grzx 元素添加事件监听
    grzx.addEventListener('mousemove', function () {
        grzx_img.innerHTML = '<img src="images/10001.png" alt="">';
    });
    grzx.addEventListener('mouseout', function () {
        grzx_img.innerHTML = '<img src="images/10008.png" alt="">';
    });

    // 为 shfw 元素添加事件监听
    shfw.addEventListener('mousemove', function () {
        shfw_img.innerHTML = '<img src="images/10003.png" alt="">';
    });
    shfw.addEventListener('mouseout', function () {
        shfw_img.innerHTML = '<img src="images/10002.png" alt="">';
    });

    // 为 rgkf 元素添加事件监听
    rgkf.addEventListener('mousemove', function () {
        rgkf_img.innerHTML = '<img src="images/10001.png" alt="">';
    });
    rgkf.addEventListener('mouseout', function () {
        rgkf_img.innerHTML = '<img src="images/10008.png" alt="">';
    });

    // 为 gwc 元素添加事件监听
    gwc.addEventListener('mousemove', function () {
        gwc_img.innerHTML = '<img src="images/10006.png" alt="">';
    });
    gwc.addEventListener('mouseout', function () {
        gwc_img.innerHTML = '<img src="images/10005.png" alt="">';
    });

    // 为 top 元素添加事件监听
    topElem.addEventListener('mousemove', function () {
        top_img.innerHTML = '<img src="images/totop_hover.png" alt="">';
    });
    topElem.addEventListener('mouseout', function () {
        top_img.innerHTML = '<img src="images/totop.png" alt="">';
    });

}
function lunb() {
    let images = document.querySelectorAll('.slider-images img');
    let dotsContainer = document.querySelector('.slider-dots');
    let imageCount = images.length;

    let currentIndex = 0;

    for (let i = 0; i < imageCount; i++) {
        let dot = document.createElement('div');
        dot.classList.add('dot');
        if (i === 0) {
            dot.classList.add('active');
        }
        dot.addEventListener('click', () => {
            showImage(i);
        });
        dotsContainer.appendChild(dot);
    }

    let dots = document.querySelectorAll('.slider-dots .dot');

    function showImage(index) {
        images.forEach(img => img.classList.remove('active'));
        dots.forEach(dot => dot.classList.remove('active'));

        images[index].classList.add('active');
        dots[index].classList.add('active');

        currentIndex = index;
    }

    function autoSlide() {
        currentIndex = (currentIndex + 1) % imageCount;
        showImage(currentIndex);
    }

    // 在页面加载完成后显示第一张图片
    document.addEventListener('DOMContentLoaded', function () {
        showImage(0);
        // 启动自动轮播
        let interval = setInterval(autoSlide, 3000);
    });
}
function qhProblem() {
    let lis = document.querySelectorAll('#problemUl li');
    let qhproblemDivs = [
        document.getElementById('qhproblem_one'),
        document.getElementById('qhproblem_two'),
        document.getElementById('qhproblem_three'),
        document.getElementById('qhproblem_four'),
        document.getElementById('qhproblem_five'),
        document.getElementById('qhproblem_six'),
        document.getElementById('qhproblem_seven')
    ];

    window.addEventListener('load', () => {
        if (lis.length > 0) {
            lis[0].classList.add('active');
            qhproblemDivs[0].style.display = 'block';
        }
    });

    lis.forEach((li, index) => {
        li.addEventListener('mouseover', () => {

            lis.forEach(item => item.classList.remove('active'));

            qhproblemDivs.forEach(div => div.style.display = 'none');

            li.classList.add('active');

            qhproblemDivs[index].style.display = 'block';
        });
    });
}
ProductNav();
ce();
lunb();
qhProblem();